import 'package:flutter/material.dart';
import 'package:flutter/cupertino.dart';
import 'cart_page.dart';
import 'category_page.dart';
import 'home_page.dart';
import 'member_page.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:provide/provide.dart';
import '../provide/currentIndex.dart';
import '../provide/cart.dart';

class IndexPage extends StatelessWidget {
  
  // 底部导航栏
  final List<BottomNavigationBarItem> bottomTabs = [
    BottomNavigationBarItem(
      icon: Icon(CupertinoIcons.home),
      title: Text('首页')
    ),
    BottomNavigationBarItem(
      icon: Icon(CupertinoIcons.search),
      title: Text('分类')
    ),
    BottomNavigationBarItem(
      icon: Stack(
        children: <Widget>[
          Icon(CupertinoIcons.shopping_cart),
          Positioned(
            right: 0,
            top: 0,
            child: Provide<CartProvide>(
              builder: (context,child,val){
                return Container(
                  alignment: Alignment(0, 0),
                  width: ScreenUtil().setWidth(30),
                  padding:EdgeInsets.fromLTRB(1, 0, 0, 1),
                  decoration: BoxDecoration(
                    color:Theme.of(context).primaryColor,
                    border:Border.all(width: 2,color: Colors.white),
                    borderRadius: BorderRadius.circular(8)
                  ),
                  child: Text(
                    '${val.allGoodsCount}',
                    style: TextStyle(
                      color: Colors.white,
                      fontSize: ScreenUtil().setSp(15)
                    ),
                  ),
                );
              },
            ),
          )
        ],
      ),
      title: Text('购物车')
    ),
    BottomNavigationBarItem(
      icon: Icon(CupertinoIcons.profile_circled),
      title: Text('会员中心')
    ),
  ];
  // 底部导航页面
  final List<Widget> tabBodies = [
    HomePage(),
    CategoryPage(),
    CartPage(),
    MemberPage()
  ];
  @override
  Widget build(BuildContext context) {
    ScreenUtil.instance = ScreenUtil(width: 750,height: 1334)..init(context);
    return Provide<CurrentIndexProvide>(
      builder: (context,child,val){
        return Scaffold(
          backgroundColor: Color.fromRGBO(244, 245, 245, 1.0),
          bottomNavigationBar: BottomNavigationBar(
            type: BottomNavigationBarType.fixed,// 点击样式
            currentIndex: val.currentIndex,  // 导航索引
            items: bottomTabs, // 指定图标文字
            onTap: (index){// 点击事件
              Provide.value<CurrentIndexProvide>(context).changeIndex(index);
            },
          ),
          body: IndexedStack(
            index: val.currentIndex,
            children: tabBodies
          ),
        );
      },
    );
  }
}